@extends('admin.common.base-master')

@section('html-head')
    <link href="{{url('css/jquery.form.css')}}" type="text/css" rel="stylesheet" />
    <script src="{{url('/js/lib/jquery.form.js')}}"></script>

    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
    <script type="text/javascript" src="//code.jquery.com/ui/1.9.1/jquery-ui.min.js"></script>
    <link href="{{url('js/lib/jquery-ui-timepicker-addon.css')}}" type="text/css" />
    <script src="{{url('js/lib/jquery-ui-timepicker-addon.js')}}" type="text/javascript"></script>
    <script src="{{url('js/lib/jquery.ui.datepicker-zh-CN.js')}}" type="text/javascript"></script>
    <script src="{{url('js/lib/jquery-ui-timepicker-zh-CN.js')}}" type="text/javascript"></script>

    <script src="{{url('js/lib/distpicker.data.js')}}" type="text/javascript"></script>
    <script src="{{url("js/lib/distpicker.js")}}" type="text/javascript"></script>

    @include('UEditor::head')

@endsection

@section('html-body')
    <!-- content start -->
    <div id="content">
        <!-- cur-position start -->
        <div id="cur-position">
            <span class="tit">当前位置：</span>
            <a href="#">设置我们的成就</a>
        </div>

        @include("admin.common.goods-header")


        <div class="gg-step">
            <form  id="advform">
                <input type="hidden" name="id" id="applicationFieldId" value="@if($applicationField){{$applicationField->id}}@endif"/>
                <input type="hidden" name="type" id="type" value="@if(!empty($type)){{$type}}@endif"/>

                <div class="gg-list">
                    <label class="tit">名称</label>
                    <div class="cont">
                        <input class="gg-ipt" type="text" placeholder="请输入名称" name="name" id="name" value="@if($applicationField){{$applicationField->title}}@endif" /><cite id="title_re" class="required">*</cite>
                        <p class="text">可输入2-40个字符（一个汉字等于2个字符）</p>
                    </div>
                </div>

                <div class="gg-list" data-id="ggzst2" >
                    <label class="tit">展示图</label>
                    <div class="demo" style="display: inline-block; padding: 0; margin: 0; *display: inline; *zoom:1;" >
                        <input type = "hidden" name = "pic_img" id = "pic_img2" value = "" height="70px" >
                        <div id="showimg">
                        </div>
                        <div class="btn" style="background: #00A2D4;">
                            <span id="inputImage">添加图片</span>
                            <input id="img_id" type="hidden" name="thumb_id" value="@if($applicationField){{$applicationField->img_id}}@endif">
                        </div>
                        <div class="progress" >
                            <span class="bar"></span><span class="percent">0%</span >
                        </div>
                        <p class="text" id="uploadthumb">上传图片（图片格式为jpg、png、gif，规格：宽限64px 高限64px）</p>
                        @if($applicationField)<img id="img_show" style="width: 100px;padding-top: 3px;" src="{{$applicationField->img_url}}" />@endif
                    </div>
                </div>

{{--                <div class="gg-list">--}}
{{--                    <label class="tit">数量类型</label>--}}
{{--                    <div class="cont">--}}
{{--                        <select name="num_type" id="num_type">--}}
{{--                            <option value="0" @if($applicationField && $applicationField->num_type == 0) selected @endif>有理数</option>--}}
{{--                            <option value="1" @if($applicationField && $applicationField->num_type == 1) selected @endif>百分数</option>--}}
{{--                        </select>--}}
{{--                        <p class="text"></p>--}}
{{--                    </div>--}}
{{--                </div>--}}

                <div class="gg-list">
                    <label class="tit">数量</label>
                    <div class="cont">
                        <input class="gg-ipt" type="text" placeholder="请输入数量" name="num" id="num" value="@if($applicationField){{$applicationField->num}}@endif" /><cite id="title_re" class="required">*</cite>
                        <p class="text">输入数值</p>
                    </div>
                </div>

                <div class="gg-list">
                    <label class="tit">排序</label>
                    <div class="cont">
                        <input class="gg-ipt" type="text" placeholder="请输入排序" name="sort" id="sort" value="@if($applicationField){{$applicationField->sort}}@endif" /><cite id="title_re" class="required">*</cite>
                        <p class="text">输入数值，1－100 数值越小越靠前</p>
                    </div>
                </div>

            </form>
            <div class="gg-list" >
                <label class="tit">&nbsp;</label>
                <div class="cont" >
                    <a href="javascript:;" class="next-step" id="btn-set">提交</a>
                </div>
            </div>
        </div>
    </div>

    <!-- content end -->
    <script>
        $(function() {
            $(document).on('click', '#btn-set', function () {
                var id             = $('#applicationFieldId').val();
                var name           = $('#name').val();
                var imgId          = $('#img_id').val();
                var numType        = $('#num_type option:selected').val();
                var num            = $('#num').val();
                var type           = $('#type').val();
                var sort           = $('#sort').val();

                $.ajax({
                    url: '{{route("Api.Admin.sys.setApplicationField")}}',
                    type: 'post',
                    dataType: 'json',
                    data: {
                        id:id,
                        name:name,
                        img_id:imgId,
                        num_type:numType,
                        num:num,
                        type:type,
                        sort:sort

                    },
                    success: function (obj) {
                        if (obj.level == "success") {
                            noty({
                                text: obj.message, type: obj.level, timeout: 600,
                                callback: {
                                    afterClose:function(){
                                        if(type == 'achievement'){
                                            window.location.href = "{{route('Admin.Home.achievementList')}}";
                                        }else{
                                            window.location.href = "{{route('Admin.Home.enAchievementList')}}";
                                        }
                                    }
                                }
                            });
                        } else if (obj.level == "error") {
                            noty({text: obj.message, type: obj.level, timeout: 600});
                        }

                    },
                    error: function (obj) {
                        console.log(obj);
                    }
                });
            });

            //缩略图上传代码
            var uploader = new plupload.Uploader({
                runtimes: 'html5,flash,silverlight,html4',
                browse_button: 'inputImage',
                url: '{{route("Api.File.upload")}}',

                chunk_size: '20mb',
                filters: {
                    max_file_size: '5mb',
                    mime_types: [
                        {title: "Image files", extensions: "jpg,gif,png"}
                    ],
                    prevent_duplicates: false
                },
                multi_selection: true,
                unique_names: true,

                flash_swf_url: '{{ url('vendor/plupload-2.1.2/Moxie.swf') }}',
                silverlight_xap_url: '{{ url('vendor/plupload-2.1.2/Moxie.xap') }}',

                file_data_name: 'photo',
                headers: {
                    Accept: 'application/json'
                },

                multipart_params: {},

                init: {
                    PostInit: function () {
                    },

                    FilesAdded: function (up, files) {
                        up.start();
                    },

                    BeforeUpload: function (up, file) {
                        up.settings.multipart_params.file_name = file.name;
                    },

                    UploadProgress: function (up, file) {
                        $('#uploadthumb').html('<span style="color:red">上传中...</span>');
                    },

                    Error: function (up, err) {
                        var responseObj = '', responseMessage = '';
                        try {
                            responseObj = $.parseJSON(err.response);
                            responseMessage = responseObj.message;
                        } catch ($e) {

                        }

                        noty({
                            type: 'error',
                            text: err.message + ' ' + responseMessage,
                            timeout: 800
                        });
                    },

                    FileUploaded: function (up, file, info) {
                        var responseObj = '', responseMessage = '';
                        try {
                            responseObj = $.parseJSON(info.response);
                            responseMessage = responseObj.message;
                        } catch ($e) {

                        }
                        if (responseObj.level == "success") {
                            $('#img_id').val(responseObj.data.id);
                            var imgURL = responseObj.data.img_url + "?" + Math.random();
                            $('#img_show').attr("src",imgURL);
                            $('#uploadthumb').html('<span style="color:green">上传成功</span>');
                        } else {
                            noty({type: responseObj.level, text: responseObj.message, timeout: 800});
                            $('#uploadthumb').html('<span style="color: red">上传失败，请重新上传！</span>');
                        }

                    }
                }
            });
            uploader.init();

            //缩略图上传代码
            var uploader1 = new plupload.Uploader({
                runtimes: 'html5,flash,silverlight,html4',
                browse_button: 'inputImage1',
                url: '{{route("Api.File.upload")}}',

                chunk_size: '20mb',
                filters: {
                    max_file_size: '5mb',
                    mime_types: [
                        {title: "Image files", extensions: "jpg,gif,png"}
                    ],
                    prevent_duplicates: false
                },
                multi_selection: true,
                unique_names: true,

                flash_swf_url: '{{ url('vendor/plupload-2.1.2/Moxie.swf') }}',
                silverlight_xap_url: '{{ url('vendor/plupload-2.1.2/Moxie.xap') }}',

                file_data_name: 'photo',
                headers: {
                    Accept: 'application/json'
                },

                multipart_params: {},

                init: {
                    PostInit: function () {
                    },

                    FilesAdded: function (up, files) {
                        up.start();
                    },

                    BeforeUpload: function (up, file) {
                        up.settings.multipart_params.file_name = file.name;
                    },

                    UploadProgress: function (up, file) {
                        $('#uploadthumb1').html('<span style="color:red">上传中...</span>');
                    },

                    Error: function (up, err) {
                        var responseObj = '', responseMessage = '';
                        try {
                            responseObj = $.parseJSON(err.response);
                            responseMessage = responseObj.message;
                        } catch ($e) {

                        }

                        noty({
                            type: 'error',
                            text: err.message + ' ' + responseMessage,
                            timeout: 800
                        });
                    },

                    FileUploaded: function (up, file, info) {
                        var responseObj = '', responseMessage = '';
                        try {
                            responseObj = $.parseJSON(info.response);
                            responseMessage = responseObj.message;
                        } catch ($e) {

                        }
                        if (responseObj.level == "success") {
                            $('#thumb_img_id').val(responseObj.data.id);
                            var imgURL = responseObj.data.img_url + "?" + Math.random();
                            $('#img_show1').attr("src",imgURL);
                            $('#uploadthumb1').html('<span style="color:green">上传成功</span>');
                        } else {
                            noty({type: responseObj.level, text: responseObj.message, timeout: 800});
                            $('#uploadthumb1').html('<span style="color: red">上传失败，请重新上传！</span>');
                        }

                    }
                }
            });
            uploader1.init();
        });
    </script>
@endsection